<template>
	<view id="myChart3" class="chart"></view>
</template>

<script>
	import * as echarts from 'echarts';

	export default {
		name: "money-back-pie",
		props: ['chartD'],
		data() {
			return {}
		},
		methods: {
			drawLine() {
				let myChart = echarts.init(document.getElementById('myChart3'))
				let option = {
					title: { show: false },
					tooltip: { trigger: 'item', confine: true },
					legend: {
						type: 'scroll',
						orient: 'vertical',
						left: 'right',
						formatter: (name) => {
							if (name.length > 5) name = name.substring(0, 3) + '...'
							return name;
						}
					},
					grid: [{
						bottom: '5%',
						left: '5%',
						right: '5%'
					}],
					series: [{
						name: '金额占比(元)',
						type: 'pie',
						radius: '50%',
						data: this.chartD,
						emphasis: {
							itemStyle: {
								shadowBlur: 10,
								shadowOffsetX: 0,
								shadowColor: 'rgba(0, 0, 0, 0.5)'
							}
						}
					}]
				}
				myChart.setOption(option)
			}
		}
	}
</script>

<style lang="scss" scoped>
	.chart {
		width: 100%;
		height: 360px;
		background-color: #FFFFFF;
	}
</style>
